<template>
    <div class="task-document-view">

      <el-table
        size="medium"
        :data="datas.files"
        border
        style="width: 100%">
        <el-table-column
          align="center"
          prop="file_name"
          label="文档名称">
        </el-table-column>
        <el-table-column
          align="center"
          prop="type_name"
          label="文档类型">
        </el-table-column>
        <el-table-column
          align="center"
          label="申报所需文件">
          <template slot-scope="scope">
            <span>{{scope.row.need?'是':'否'}}</span>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          label="是否提交">
          <template slot-scope="scope">
            <span v-if="scope.row.file && scope.row.file.id">是</span>
            <span v-else>否</span>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          label="线下提交">
          <template slot-scope="scope">
            <span>{{scope.row.offline?'是':'否'}}</span>
          </template>
        </el-table-column>

        <el-table-column
          align="center"
          prop="file.file_version"
          label="版本号">
        </el-table-column>
        <el-table-column
          align="center"
          prop="file.file_no"
          label="文件编号">
        </el-table-column>
        <el-table-column
          align="center"
          label="操作">
          <template slot-scope="scope" >

            <div class="btn-view">
              <el-button
                v-if="(scope.row.file && scope.row.file.id) && checkDownload(scope.row)"
                size="medium"
                type="text"
                @click="checkClick(scope.row.id)">
                查看
              </el-button>

              <el-button
                v-if="(scope.row.file && scope.row.file.id) && checkDownload(scope.row)"
                size="medium"
                type="text"
                @click="downloadClick(scope.row.id)">
                下载
              </el-button>

              <el-button v-if="checkUpload(scope.row) && !disbale && (!scope.row.file || !scope.row.file.id)" size="medium" type="text" @click="onUpload(scope)">
                上传
              </el-button>

              <el-button v-else-if="checkUpload(scope.row) && !disbale" size="medium" type="text" @click="onDelete(scope.row)">
                删除
              </el-button>
<!--              <upload-->
<!--                v-if="checkUpload(scope.row)"-->
<!--                size="medium"-->
<!--                btnType="text"-->
<!--                btnTitle="上传"-->
<!--                :limit="1"-->
<!--                :showList="false"-->
<!--                :project-data="projectData"-->
<!--                :tipShow="false"-->
<!--                @uploadSuccess="((data)=>{uploadClick(data,scope.row.id)})">-->

<!--              </upload>-->


            </div>

          </template>
        </el-table-column>
      </el-table>

      <pdf-and-png-dialog ref="pdf"></pdf-and-png-dialog>

      <el-dialog
        v-if="dialogVisible"
        title="文档上传"
        :visible.sync="dialogVisible"
        width="750px"
        append-to-body
        :before-close="dialogClose">

        <div>

          <el-form ref="form" :model="form" :rules="rules" label-width="100px" style="width: 1200px">

            <el-form-item label="文档：" prop="list">
              <upload ref="upload" :edit-list="form.list" @uploadSuccess="uploadSuccess" @deleteSuccess="deleteSuccess" :limit="limit" />
            </el-form-item>

            <el-form-item label="文件编号：" prop="quality_standard_no">
              <el-input
                v-model="form.quality_standard_no"
                placeholder="请输入文件编号"
                clearable
                style="width: 200px"
              />
            </el-form-item>

            <el-form-item label="版本号：" prop="version">
              <el-input
                v-model="form.version"
                placeholder="请输入文件版本号"
                style="width: 200px"
                clearable
              />
            </el-form-item>

            <el-form-item v-if="file && file.file_type == 'quality_standard'" label="适用范围：" prop="sample_type_key">
              <el-select
                v-model="form.sample_type_key"
                placeholder="请选择适用范围"
                multiple
                collapse-tags
                style="width: 200px"
                @change="sampleTypeChange"
              >
                <el-option
                  v-for="(item, index) in sampleTypeOptions"
                  :key="item.id"
                  :label="item.dict_val"
                  :value="item.id"
                />
              </el-select>
            </el-form-item>

            <el-form-item label="线下提交：">
              <el-checkbox v-model="form.offline"></el-checkbox>
            </el-form-item>

          </el-form>

        </div>


        <span slot="footer" class="dialog-footer">
          <el-button @click="dialogVisible = false">取 消</el-button>
          <el-button type="primary" @click="onConfirm">确 定</el-button>
        </span>
      </el-dialog>

    </div>
</template>

<script>
  import pdfAndPngDialog from "../../../../../modules/pdfAndPngDialog";
  import {fileEditFun,filePreviewFun,downloadFun} from "../../../../../../../utils/file";

  export default {
      name: "taskDocumentView",
      components:{pdfAndPngDialog},
      props:{
          datas:Object,
          projectId:String,
          disbale:{
              type:Boolean,
              default:function () {
                  return false
              }
          }
      },
      data:function () {
          var filePass = (rule, value, callback) => {
              const fileList = this.$refs.upload.emitFileList() || []
              if (fileList.length !== 0) {
                  callback()
              } else {
                  this.$message.error('请上传文件附件')
              }
          }
          return{
              list:[],
              fileType:['.jpg', '.png', '.pdf', '.doc', '.xls', '.xlsx'],
              projectData:{},
              dialogVisible:false,
              file:null,
              form:{
                  list:[],
                  offline:false,
                  version:'',
                  quality_standard_no:'',
                  sample_type_value:'',
                  sample_type_key:[],
              },
              limit:1,
              index:0,

              sampleTypeOptions: [],
              rules: {
                  quality_standard_no: [
                      {
                          required: true,
                          message: '请输入编号',
                          trigger: 'blur'
                      },
                      { pattern: '[^ \x22]+', message: '不能输入纯空格', trigger: 'blur' }
                  ],
                  version: [
                      {
                          required: true,
                          message: '请输入版本号',
                          trigger: 'blur'
                      },
                      { pattern: '[^ \x22]+', message: '不能输入纯空格', trigger: 'blur' }
                  ],
                  sample_type_key: [
                      {
                          required: true,
                          message: '请选择样品类型',
                          trigger: 'change'
                      }
                  ],
                  list: [
                      {
                          type: 'array',
                          required: true,
                          validator: filePass,
                          trigger: 'change'
                      }
                  ],
                  normal: []
              },
          }
      },
      mounted:function(){
          this.projectData.project_id = this.datas.project_id;
          this.projectData.validation = true;

          let allDic = this.$store.getters.sysDic()
          this.sampleTypeOptions = allDic['sample_type']
      },
      methods:{
          // 样品类型选择改变
          sampleTypeChange(val) {
              // const obj = this.sampleTypeOptions.find((itm) => {
              //     return itm.id === val
              // })
              // this.form.sample_type_value = obj.dict_val
          },
          deleteSuccess() {
              this.form.list = this.$refs.upload.emitFileList()
          },
          uploadSuccess() {
              this.form.list = this.$refs.upload.emitFileList()
          },
          dialogClose:function(){
              this.dialogVisible = false
          },
          checkUpload:function(data){
              if (this.datas.status == 0 || this.datas.status == 2 || this.datas.status == 4 || this.datas.status == 6 || this.datas.status == 7){
                  return false
              }
              let id = this.$store.getters.userInfo.user.id;
              if (data.file && data.file.id){
                  if (id == data.file.creator_id){
                      return true
                  }else{
                      return false;
                  }
              }else if (id == this.datas.person_in_charge.member_id){
                  return true;
              }

          },
          checkDownload:function(data){
              let id = this.$store.getters.userInfo.user.id;
              if (data.file && data.file.id){
                  if (data.file.creator_id == id){
                      return true
                  } else if (data.persons){
                      let index = data.persons.findIndex(a=>a == id)

                      return index != -1
                  }
                  return false

              }else {
                  return false
              }

          },
          onUpload(scope){
              this.index = scope.$index
              this.file = scope.row
              this.form = {
                  list:[],
                  offline:false,
                  version:'',
                  quality_standard_no:'',
                  sample_type_value:'',
                  sample_type_key:[],
              }
              this.dialogVisible = true;
          },
          onConfirm:function(){

              if (this.$refs.form){
                  this.$refs.form.validate((valid) => {
                      if (valid){
                          let file = JSON.parse(JSON.stringify(this.datas.files[this.index]))
                          let check = {
                              file_no:this.form.quality_standard_no,
                              file_version:this.form.version,
                              ipd_file_type:file.file_type,
                          }
                          this.$api.FILE_IS_EXIST(check).then(res=>{
                              if (res.code == 200){
                                  if (!res.data){

                                      let data = this.form.list[0]
                                      data.project_id = this.datas.project_id
                                      data.project_name = this.datas.project_name
                                      data.file_no = this.form.quality_standard_no
                                      data.file_version = this.form.version
                                      data.task_id = this.datas.id
                                      data.task_name = this.datas.task_name
                                      // data.sample_type_key = this.form.sample_type_key
                                      data.sample_type_value = this.form.sample_type_value
                                      data.ipd_file_type = file.file_type
                                      data.ipd_type_name = file.type_name
                                      data.model_id = this.datas.id
                                      data.model_no = this.datas.task_no;

                                      data.list = []
                                      this.form.sample_type_key.forEach(item => {
                                          const obj = this.sampleTypeOptions.find((itm) => {
                                              return itm.id === item
                                          })
                                          let a = {
                                              sample_type_key:obj.dict_key,
                                              sample_type_value:obj.dict_val
                                          }
                                          data.list.push(a)
                                      })

                                      file.task_id = this.datas.id;
                                      file.file = data;
                                      file.offline = this.form.offline
                                      file.persons = file.persons || [this.$store.getters.userInfo.user.id]


                                      this.$api.PROJECT_WORK_TASK_UPDATEFILE(file).then(res=>{
                                          if (res.code == 200){
                                              this.$message.success("提交成功")
                                              this.$set(this.datas.files,this.index,file)
                                              // this.list[this.index].offline = this.form.offline;
                                              this.dialogVisible = false;
                                          }else{
                                              this.$message.error(res.msg)
                                          }
                                      })

                                  }else{
                                      this.$message.error('版本号重复，请输入其他版本号')
                                  }
                              }else{
                                  this.$message.error(res.msg)
                              }
                          })
                      }
                  })
              }

              // if (this.form.list.length){
              //     let file = JSON.parse(JSON.stringify(this.datas.files[this.index]))
              //     file.list = this.form.list;
              //     file.offline = this.form.offline;
              //     file.task_id = this.datas.id
              //     this.$api.PROJECT_WORK_TASK_UPDATEFILE(file).then(res=>{
              //         if (res.code == 200){
              //             this.$message.success("提交成功")
              //             this.datas.files[this.index].list = this.form.list
              //             this.datas.files[this.index].offline = this.form.offline;
              //             this.$route.params.refresh = true;
              //         }else{
              //             this.$message.error(res.msg)
              //         }
              //     })
              //     this.dialogVisible = false;
              // }else {
              //     this.$message.error("请添加文档")
              // }

          },
          onDelete:function(row){
              row.file = {}
              row.task_id = this.datas.id;
              this.$api.PROJECT_WORK_TASK_UPDATEFILE(row).then(res=>{
                  if (res.code == 200){
                      this.$message.success("删除成功")

                      this.datas.files[this.index] = row
                      this.datas.files[this.index].offline = false
                      // this.list[this.index].offline = this.form.offline;
                  }else{
                      this.$message.error(res.msg)
                  }
              })
          },
          uploadClick:function (data,id) {

              let index = this.datas.files.findIndex(a=>a.id == id)
              if (index != -1){

                  let file = {...this.datas.files[index]}
                  file.list = data
                  file.task_id = this.datas.id
                  this.$api.PROJECT_WORK_TASK_UPDATEFILE(file).then(res=>{
                      if (res.code == 200){
                          this.datas.files[index].list = data
                      }
                  })
              }
          },
          editClick:function (id) {
              let index = this.datas.files.findIndex(a=>a.id == id)
              if (index != -1){

                  let file = {...this.datas.files[index]}

                  fileEditFun(file.file)
              }
          },
          checkClick:function (id) {
              let index = this.datas.files.findIndex(a=>a.id == id)
              if (index != -1){

                  let file = JSON.parse(JSON.stringify(this.datas.files[index]))

                  const suffix = file.file.suffix.toLowerCase()

                  if (suffix === '.jpg' || suffix === '.jpeg' || suffix === '.png' || suffix === '.pdf'){
                      if (this.$refs.pdf){
                          this.$refs.pdf.openDialog(file.file);
                      }

                  }else {
                      filePreviewFun(file.file)
                  }
              }
          },
          downloadClick:function (id) {
              let index = this.datas.files.findIndex(a=>a.id == id)
              if (index != -1){

                  let file = {...this.datas.files[index]}

                  downloadFun(file.file)
              }
          }
      }
  }
</script>

<style lang="scss" scoped>
  @import "@/assets/scss/views/projectManagement/list/details/taskDocumentView.scss";
</style>
